<template>
	<view class="content">
		<f-navbar title="浏览记录" fontColor="#333" fontSize="34" bgColor="#fff">
			<view class="u-flex" slot="left">
				<van-icon name="arrow-left" color="#333" size="20"/>
			</view>
		</f-navbar>
	<view class="content_box" v-if="dataList.length>0">
<!-- 		<scroll-view @scrolltolower="lowerBottom" @refresherrefresh="getFresh" scroll-y="true"
			class="scrollHeight" :style="{marginTop:0+'rpx'}" refresher-enabled="true" :scroll-top="scrollTop" :refresher-threshold="100"
			:refresher-triggered="triggered" :scroll-with-animation="true"> -->
		<view class="content_item" v-for="(item,index) in dataList" :key="index">
			<view class="content_itemtopL" @click.stop="onstoredetail(item)">
					<image class="content_itemtopLimg" :src="imgurl+'shop_icon.png'" mode=""></image>
				<view class="content_itemtopLname">{{item.store_name}}</view>
				<van-icon name="arrow" size="16" color="#bbb"/>
			</view>
			<view class="content_info" @click="ongooddetail(item)">
				<view class="content_infoimg">
					<image class="content_infoimg1" :src="item.good_img" mode=""></image>
				</view>
				<view class="content_infoR">
					<view class="content_infoRtitle">{{item.title}} </view>
					<view class="content_infoRprice">￥{{item.price}}</view>
					<view class="content_infoRbtn">
						<view class="content_infoRbtn_num">已售{{item.total_sale_num}}件</view>
						<view class="content_infoRQX" @click.stop="historydelete(item)">删除</view>
					</view>
				</view>
			</view>
		</view>
		<!-- </scroll-view> -->
<!-- 		<view class="content_item">
			<view class="content_itemtopL">
				<view class="content_itemtopLimg"></view>
				<view class="content_itemtopLname">鲜果汇专卖店</view>
				<van-icon name="arrow" size="16" color="#bbb"/>
			</view>
			<view class="content_info">
				<view class="content_infoimg"></view>
				<view class="content_infoR">
					<view class="content_infoRtitle">2022年时尚百搭卫衣优惠促销春节2022年时尚百搭卫衣2022年时尚百搭卫衣2022年时尚百搭卫衣.. </view>
					<view class="content_infoRprice">￥15.80</view>
					<view class="content_infoRbtn">
						<view class="content_infoRbtn_num">已售2000件</view>
						<view class="content_infoRQX">删除</view>
					</view>
				</view>
			</view>
		</view>
		<view class="content_item">
			<view class="content_itemtopL">
				<view class="content_itemtopLimg"></view>
				<view class="content_itemtopLname">鲜果汇专卖店</view>
				<van-icon name="arrow" size="16" color="#bbb"/>
			</view>
			<view class="content_info">
				<view class="content_infoimg"></view>
				<view class="content_infoR">
					<view class="content_infoRtitle">2022年时尚百搭卫衣优惠促销春节2022年时尚百搭卫衣2022年时尚百搭卫衣2022年时尚百搭卫衣.. </view>
					<view class="content_infoRprice">￥15.80</view>
					<view class="content_infoRbtn">
						<view class="content_infoRbtn_num">已售2000件</view>
						<view class="content_infoRQX">删除</view>
					</view>
				</view>
			</view>
		</view>
		<view class="content_item">
			<view class="content_itemtopL">
				<view class="content_itemtopLimg"></view>
				<view class="content_itemtopLname">鲜果汇专卖店</view>
				<van-icon name="arrow" size="16" color="#bbb"/>
			</view>
			<view class="content_info">
				<view class="content_infoimg"></view>
				<view class="content_infoR">
					<view class="content_infoRtitle">2022年时尚百搭卫衣优惠促销春节2022年时尚百搭卫衣2022年时尚百搭卫衣2022年时尚百搭卫衣.. </view>
					<view class="content_infoRprice">￥15.80</view>
					<view class="content_infoRbtn">
						<view class="content_infoRbtn_num">已售2000件</view>
						<view class="content_infoRQX">删除</view>
					</view>
				</view>
			</view>
		</view> -->
	</view>
	<!-- 暂无数据 -->
	<view class="zwbox" v-else>
		<view class="zwimgbox">
			<image class="zwimg" src="https://yuanchubao.oss-cn-beijing.aliyuncs.com/zwicon1.png" mode="">
			</image>
		</view>
		<view class="zwtxt">
			暂无数据
		</view>
	
	</view>
	</view>
</template>

<script>
	import fNavbar from '@/uni_modules/f-navbar/components/f-navbar/f-navbar.vue';
	import {getBrowseHistory,delBrowseHistory} from '../../../utils/app.js'
	export default {
		components: {
			fNavbar
		},
		data() {
			return {
				imgurl: getApp().globalData.imgurl,
				active:'1',
				navHeight:0, //导航栏的高度
				pages: 1, // 分页数据
				PageSize: 4, // 一页有多少数据
				total: null, // 总条数	
				dataList: [], // 列表数据
				triggered:false, // 设置是否下拉
				scrollTop: 0 ,
			}
		},
		onLoad() {
			this.getList()
		},
		methods:{
			// 进店铺详情
			onstoredetail(e){
				console.log(e);
				uni.navigateTo({
					url:'/pages/storeDetail/storeDetail?storeid='+e.store_id
				})
			},
			// 跳转到详情页
			ongooddetail(e){
				uni.navigateTo({
					url: '/pages/goodsDetail/goodsDetail?codeid=' + e.code
				})
			},
			// 获取数据
			getList() {

				getBrowseHistory({

				}).then(res => {
					console.log(res);
					if(res.code==1){
						this.dataList = res.data
					}else {
						uni.showToast({
							icon:'none',
							title:res.info,
							duration:1000
						})
						if(res.info=='请先登录'){
							setTimeout(function(){
								uni.navigateTo({
									url: '/pages/subPack/Login/Login'
								})
							},1000)
						}
					}
					

				})
			},
			// 删除浏览记录
			historydelete(e){
				
				delBrowseHistory({
					code: e.code
				}).then(res => {
					console.log(res);
					// this.dataList = res.data
					if(res.code==1){
						uni.showToast({
							title:'删除成功',
							icon:'none'
						})
						this.getList()
					} else {
						uni.showToast({
							title:res.info,
							icon:'none'
						})
					}
					
				
				})
			},
			//触底加载
			// lowerBottom() {
			// 	// 判断是否还有下一页数据
			// 	// if (this.pages * this.PageSize >= this.total) return person.showMoreData = true
			// 	// 让页码值自增 +1
			// 	// console.log('999');
			// 	// this.pages += 1
			// 	// 重新获取列表数据
			// 	this.getList(false)
			// },
			// 下拉刷新
			// getFresh() {
			// 	this.triggered = true,
			// 	this.getList(true)
				
			// },
			
		}
		}
</script>

<style>
	page{
		background: #eee;
	}
	.content_item{
		width: 690rpx;
		height: 280rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
	}
	.content_itemtopL{
		display: flex;
		align-items: center;
		padding-top: 19rpx;
	}
	.content_itemtopLimg{
		width: 32rpx;
		height: 29rpx;
		/* background: #000; */
		margin-left: 20rpx;
		margin-right: 10rpx;
	}
	.content_itemtopLname{
		font-size: 30rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #333333;
		margin-right: 20rpx;
	}
	.content_info{
		display: flex;
		align-items: center;
		margin-top: 26rpx;
	}
	.content_infoimg{
		width: 180rpx;
		height: 180rpx;
		/* background: #FF0000; */
		border-radius: 10rpx;
		margin-left: 20rpx;
		
	}
	.content_infoimg1{
		width: 100%;
		height: 100%;
	}
	.content_infoR{
		width: 64%;
		margin-left: 20rpx;
	}
	.content_infoRtitle{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 30rpx;
		overflow : hidden;
		 text-overflow: ellipsis;
		 display: -webkit-box;
		 -webkit-line-clamp: 2;
		 -webkit-box-orient: vertical;
	}
	.content_infoRprice{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF0000;
		/* line-height: 40rpx; */
		margin-top: 50rpx;
	}
	.content_infoRbtn{
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
	}
	.content_infoRbtn_num{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
		/* line-height: 2rpx; */
	}
	.content_infoRQX{
		width: 132rpx;
		height: 41rpx;
		border: 1rpx solid #BBBBBB;
		border-radius: 20rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #BBBBBB;
		line-height: 42rpx;
		text-align: center;
	}
	/* 暂无数据 */
	.zwbox{
		/* margin: 0 auto; */
		width: 100%;
		margin: 200rpx auto;
	}
	.zwimgbox{
		width: 141rpx;
		height: 106rpx;
		margin: 0 auto;
	}
	.zwimg{
		width: 100%;
		height: 100%;
	}
	.zwtxt{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		margin-top: 30rpx;
		text-align: center;
	}
</style>